<%@ page contentType="text/html;charset=UTF-8"%>
<%@ include file="/WEB-INF/views/include/taglib.jsp"%>
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>创建报价单</title>
    <%@ include file="/WEB-INF/views/include/head.jsp"%>
    <script src="${ctxStatic}/js/jquery-1.9.1.min.js"></script>
    <script src="${ctxStatic}/js/DateTimePicker.js"></script>
    <script src="${ctxStatic}/js/layer.js"></script>
    <script src="${ctxStatic}/js/style.js"></script>
    <script src="${ctxStatic}/dateCalendar/WdatePicker.js"></script>
    <link rel="stylesheet" href="${ctxStatic}/css/common.css">
    <link rel="stylesheet" href="${ctxStatic}/css/layerSm.css">
    <script>
    $(function(){
            $(".tabBox ul li").each(function(){
                var index=$(this).index();

                $(".tabBox ul li").eq(0).addClass("active");

                $(this).click(function(){

                    //alert(index);

                    $(this).addClass("active").siblings().removeClass("active");

                    $(".tabBoxSm > .tabSm").eq(index).stop(true).show().siblings().stop(true).hide();
					
					var tableW = $(".tabBoxSm > .tabSm").eq(index).find('.tableHead').width();
					var tabodyH = $(".tabBoxSm > .tabSm").eq(index).find('.tableBody').height();
					var tableScrollH = $(".tabBoxSm > .tabSm").eq(index).find('.tableScroll').height();
					if(tabodyH>tableScrollH){
						$(".tabBoxSm > .tabSm").eq(index).find('.tableScroll').css('width',tableW + 18 + 'px')
					}else{
						$(".tabBoxSm > .tabSm").eq(index).find('.tableScroll').css('width','inherit')
					}

                })

            })

        })
        
        $(document).ready(function(){
        	var qid = "${quotation.id}";
        	if (qid != null && qid != '') {
	        	imageList("${quotation.styleID}","${quotation.styleFile}");
			}
        	$(".btn").hide();
        	sumAllCount();
        	var form = $("#inputForm");  
            form.validate();//验证指定的表单
        	$("#offerTypeCD").select2();
        	$("#unitCostNO").select2();
       		$("#offerCurrencyCD").select2();
       		unitFun('${quotation.styleID}',"unitCostNO")
                var row = document.getElementById("materialTable").rows.length;
        		$("#materialSum").val(row);
       		$("#okButton").click(function(){
        		if (form.valid()) {//如果表单验证成功，则进行提交。  
        		/* $("#showHtml").addClass("showHtml");
                $("#okHead").show();
                $("#createHead").hide();   */
                saveFormData();
                return false;
              	}
         	});
        });
        
    
   /*  图片集   */
    function imageList(styleID,styleFile) {
    	url = "?styleID="+styleID+"&styleFile="+styleFile;
    	$.post("${ctx}/quotation/message/findImageList"+url, "", function(result) {
    		var styleImageList = result["imageListHtml"];
    		$("#nameImagePreview").html(styleImageList);
    		$("#nameImagePreview").find("a").remove();
    		$(".square ol li").removeClass("active");
    		$(".square ol li:last-child").addClass("active");
    		$("#nameImagePreview img").attr("width","200px");
    		$("#nameImagePreview img").attr("height","200px");
    	}, 'json');
	}
    
    /* 保存创建/编辑信息 */
    function saveFormData(){
    	var materail = 0;
    	var accessorie = 0;
    	var others = 0;
    	var printingEmbroidery = 0;
    	var brand = 0;
    	$(".type-1").each(function(i,e){
    		materail = parseFloat(materail) + parseFloat($(e).val());
    	});
    	document.getElementById("materail").value=materail;
    	$(".type-2").each(function(i,e){
    		accessorie = parseFloat(accessorie) + parseFloat($(e).val());
    	});
   		document.getElementById("accessorie").value=accessorie;
   		$(".type-3").each(function(i,e){
   			others = parseFloat(others) + parseFloat($(e).val());
    	});
       	document.getElementById("others").value=others;
       	$(".type-4").each(function(i,e){
       		printingEmbroidery = parseFloat(printingEmbroidery) + parseFloat($(e).val());
    	});
   		document.getElementById("printingEmbroidery").value=printingEmbroidery;
   		$(".type-5").each(function(i,e){
   			brand = parseFloat(brand) + parseFloat($(e).val());
    	});
   		document.getElementById("brand").value=brand;
    	unFormat($("#offerBrokerage"));
    	unFormat($("#offerRebate"));
    	unFormat($("#offerCM"));
    	unFormat($("#offerMargins"));
    	var params = $("#inputForm").serialize();
    	$.post("${ctx}/quotation/message/save",params,function(result){
    		/* 弹出提示框,刷新父页面,关闭当前页面 */
    		tipParent(result.message);
    		window.parent.frames[0].searchListForm();
    		closeWin();
    	},'json');
    	
    }
    
  //单耗联动
    function unitFun(t,id){
        var code=t;
        var param={"code":code};
        $.post("${ctx}/quotation/message/unitCost",param,function(result){
            var html="<option value=''><spring:message code="company_edit_pleaseChoose"/></option>";
            var costID = ${quotation.unitCostID};
            $.each(result,function(i,e){
                html+="<option value='"+e.unitCostID+"'";
                if (costID==e.unitCostID) {
					html+="selected='selected'";
				}
                html+=" >"+e.unitCostNO+"</option>";
            });
            $("#"+id).html(html);
            $("#"+id).select2();
        },'json');
    }	
    
     function findUnit(t){
    	var id = $(t).find("option:selected").val();
    	var code = $(t).find("option:selected").attr("value");
    	var param={"id":id};
    	var html="";
    	var inputHidden="";
    	if(code!=null && code!=""){
	    	$.post("${ctx}/quotation/message/material",param,function(result){
	    		$.each(result,function(i,e){       			
	    			var price = parseFloat(e.materialUnitPrice)*parseFloat(e.materialTaxRebate);
	    			var amount = parseFloat(e.materialUnitExpend)*parseFloat(price);
	    			inputHidden = "<input type='hidden' name='quotationMaterialList["+i+"].materialID' value='"+e.materialID+"'>";
	    			html+="<tr><td><p class='tab-cz'><img src='${ctxStatic}/images/btn-sc.png' class='tab-cz' onclick='deleteCurrentRow(this)'></p></td>";
	    			html+="<td><p class='tab-wltp'><img src='"+e.materialFile+"' style='width:50px;height:50px' ></p></td>";
	    			html+="<td><p class='tab-wlmcbj'>"+e.materialCode+"<br>"+e.materialNameCN+"</p></td>";
	    			html+="<td><p class='tab-wllb'>"+e.styleMaterialTypeCN+"</p></td>";
	    			html+="<td><p class='tab-fk'>"+e.materialSpec+"</p></td>";
	    			html+="<td><p class='tab-dw'>"+e.materialSpecUnit+"</p></td>";
	    			html+="<td><p class='tab-dh' style='width: 70px;'><input name='quotationMaterialList["+i+"].materialCost' value='"+e.materialCost+"' onchange='myMath(this,0);'></p></td>";
	    			html+="<td><p class='tab-sh' style='width: 70px;'><input name='quotationMaterialList["+i+"].materialPreLoss' value='"+e.materialPreLoss+"' onchange='myMath(this,0);'></p></td>";
	    			html+="<td><p class='tab-zdj' style='width: 70px;'><input name='quotationMaterialList["+i+"].materialUnitExpend' value='"+e.materialUnitExpend+"'></p></td>";
	    			html+="<td><p class='tab-dj' style='width: 70px;'><input name='quotationMaterialList["+i+"].materialUnitPrice' value='"+e.materialUnitPrice+"' onchange='myMath(this,0);'></p></td>";
	    			html+="<td><p class='tab-ts' style='width: 70px;'><input name='quotationMaterialList["+i+"].materialTaxRebate' value='"+e.materialTaxRebate+"' onchange='myMath(this,0);'></p></td>";
	    			html+="<td><p class='tab-jj' style='width: 70px;'>"+price+"</p></td>";
	    			html+="<td><p class='tab-hjje' style='width: 80px;'><input class='type-"+e.materialType+" amount' value='"+amount+"'></p></td>"+inputHidden+"</tr>";
	    			$("#unitCostID").val(e.unitCostID);
		    		$("#unitCost").val(e.unitCost);
	    		});
	    		$("#listHtml").html(html);
	    		var row = document.getElementById("materialTable").rows.length;
	    		$("#materialSum").val(row);
	    		sumAllCount();
	    	},'json');
    	}else{
    		$("#unitCost").val("");
    		$("#listHtml").html(html);
    		quotationMath();
    	}
    } 
     /*  统一计算   */
     function sumAllCount(){
    	var totalAmount = parseFloat(0);
    	var inputLength = $(".tab-dh input").length;
    	var amount;
    	if (inputLength != 0) {
			for (var i = 0; i < inputLength; i++) {
				amount = myMath($(".tab-dh input")[i],1);
				totalAmount = totalAmount + parseFloat(amount);
			}
		}
    	$("#unitCost").val(totalAmount);
    	$("#offerAmount").val(totalAmount);
    	formatMoney($("#offerAmount"), 2);
    	formatMoney($("#unitCost"), 2);
    	quotationMath();
     }
     /* 计算报价金额  */
     function sumAmount(){
    	var totalAmount = parseFloat(0);
    	var amount;
    	$.each($(".amount"),function(i,e){
    		amount = $(e).val().replace(/,/g, "");
    		totalAmount = totalAmount + parseFloat(amount);
        });
    	$("#unitCost").val(totalAmount);
    	$("#offerAmount").val(totalAmount);
    	formatMoney($("#offerAmount"), 2);
    	formatMoney($("#unitCost"), 2);
     }
     
	/* 删除 面料  */
	 
	 function deleteCurrentRow(obj){ 
		 
		 if (confirm("<spring:message code="quotation_create_areYouSure"/>")) {
            var tr=obj.parentNode.parentNode.parentNode;  
            var tbody=tr.parentNode 
            tbody.removeChild(tr); 
            var row = document.getElementById("materialTable").rows.length;
    		$("#materialSum").val(row);
    		sumAmount();
    		quotationMath();
		}
	 }
     
    function quotationMath(){
    	//单耗成本 
    	var unitCost = document.getElementById("unitCost").value;
    	unitCost = unitCost.replace(/,/g, "");
    	//单件利润 
    	var offerMargins = document.getElementById("offerMargins").value;
    	offerMargins = offerMargins.replace(/,/g, "");
    	//加工费  
    	var offerCM = document.getElementById("offerCM").value;
    	offerCM = offerCM.replace(/,/g, "");
    	//单件折扣 
    	var offerRebate = document.getElementById("offerRebate").value;
    	offerRebate = offerRebate.replace(/,/g, "");
    	//单件佣金 
    	var offerBrokerage = document.getElementById("offerBrokerage").value;
    	offerBrokerage = offerBrokerage.replace(/,/g, "");
    	if(unitCost==null||unitCost==""){
    		unitCost = 0;
    	}
    	if(offerMargins==null||offerMargins==""){
    		offerMargins = 0;
    	}
		if(offerCM==null||offerCM==""){
			offerCM = 0;
    	}
		if(offerRebate==null||offerRebate==""){
			offerRebate = 100;
    	}
		if(offerBrokerage==null||offerBrokerage==""){
			offerBrokerage = 0;
    	}
		var result =(parseFloat(unitCost)+parseFloat(offerMargins)+parseFloat(offerCM)+parseFloat(offerBrokerage))*parseFloat(offerRebate)/100;
		
		document.getElementById("offerAmount").value = result;
		formatMoney($("#offerAmount"), 2);
    	
    } 
	/*  款式改变清空画面数据  */
	function changeStyle(){
		
		$("input").val("");
		$("select").val("");
		$("textarea").val("");
		//$("img").src("${ctxStatic}/images/pic-none.jpg");
		$("#listHtml").html("");
		$("#historyList").html("");
	}
	
	function myMath(t,flag){
		var tr = $(t).parent().parent().parent();
		//单耗 
		var materialCost = tr.find(".tab-dh input").val().replace(/,/,"");
		if (materialCost==null||materialCost=="") {
			materialCost = 0;
		}
		//损耗率% 
		var materialPreLoss = tr.find(".tab-sh input").val().replace(/,/,"");
		if (materialPreLoss==null||materialPreLoss=="") {
			materialPreLoss = 0;
		}
		//总单耗
		var materialUnitExpend = parseFloat(materialCost)*(parseFloat(materialPreLoss)/100+parseFloat(1));
		tr.find(".tab-zdj input").val(materialUnitExpend);
		formatMoney(tr.find(".tab-zdj input"), 2);
		//单价 
		var materialUnitPrice = tr.find(".tab-dj input").val().replace(/,/,"");
		if (materialUnitPrice==null||materialUnitPrice=="") {
			materialUnitPrice = 0;
		}
		//退税
		var materialTaxRebate = tr.find(".tab-ts input").val().replace(/,/,"");
		if (materialTaxRebate==null||materialTaxRebate=="") {
			materialTaxRebate = 0;
		}
		//净价 
		var price = parseFloat(materialUnitPrice)*parseFloat(materialTaxRebate);
		tr.find(".tab-jj").text(price);
		formatMoneyThis(tr.find(".tab-jj"), 2)
		//合计金额 
		var amount = parseFloat(materialUnitExpend)*parseFloat(price);
		tr.find(".tab-hjje input").val(amount);
		formatMoney(tr.find(".tab-hjje input"), 2);
		if (flag == 0) {
			sumAmount();
			quotationMath();
		}
		return amount;
	}
	
	//格式化金额
    function formatMoneyThis(e, n) {  
    	var s=$(e).text().replace(",","").trim();
    	//判断字符串是否为数字     //判断正整数 /^[1-9]+[0-9]*]*$/  
    	var numberVerification = /^[0-9]+.?[0-9]*$/;   
        if (numberVerification.test(s)){
        	n = n > 0 && n <= 20 ? n : 2;  
            s = parseFloat((s + "").replace(/[^\d\.-]/g, "")).toFixed(n) + "";  
            var l = s.split(".")[0].split("").reverse(), r = s.split(".")[1];  
            t = "";  
            for (var i = 0; i < l.length; i++) {  
                t += l[i] + ((i + 1) % 3 == 0 && (i + 1) != l.length ? "," : "");  
            } 
            $(e).text(t.split("").reverse().join("") + "." + r);
        }else{
        	$(e).text("");
        }
    }  
	
    </script>
</head>
<body>
<form id="inputForm">
<!-- 创建编辑头部 -->   
<div id="createHead" class="layerHeader clearfix">
<c:choose>
	   <c:when test="${quotation.id!=null && quotation.id!=''}">
	    <!-- 编辑 --> 
			<p class="headerTitle"><spring:message code="quotation_create_editQuotation"/></p>
       </c:when>
       <c:otherwise>
        <!-- 创建 --> 
            <p class="headerTitle"><spring:message code="quotation_create_createQuotation"/></p>
       </c:otherwise>
    </c:choose>
	
    <div class="headerButton clearfix">
        <%-- <button type="button"><spring:message code="quotation_create_download"/></button>
        <button type="button"><spring:message code="quotation_create_history"/></button> --%>
        <button type="button" id="okButton"><spring:message code="quotation_create_ok"/></button>
        <button type="button" onclick="closeWin()"><spring:message code="quotation_create_cancle"/></button>
    </div>
</div>
<!-- 确认画面头部 -->
<div id="okHead" class="layerHeader clearfix" style="display: none;">	      
             <p class="headerTitle"><spring:message code="warehouse_edit_ok" /></p>    
    <div class="headerButton clearfix">
    <c:choose>
	   <c:when test="${quotation.id!=null && quotation.id!=''}">
	    <!-- 编辑 保存 --> 
	    <shiro:hasPermission name="quotation:message:edit">
			<button type="button" onclick="saveForm();"><spring:message code="common_save" /></button>
		</shiro:hasPermission>
       </c:when>
       <c:otherwise>
        <!-- 创建 保存 --> 
        <shiro:hasPermission name="quotation:message:edit">
            <button type="button" onclick="saveForm();"><spring:message code="common_save" /></button>
            </shiro:hasPermission>
       </c:otherwise>
     </c:choose>
        <!-- 取消 -->
          <button type="button" onclick="closeWin()"><spring:message code="quotation_create_cancle"/></button>
    </div>
</div>
<div class="tabBox">
    <ul class="clearfix">
     	<li class="active"><spring:message code="quotation_create_information"/></li>
        <li><spring:message code="quotation_create_material"/></li>
    </ul>
   <!--  <p class="tab-a">物料金额：<input id="" name=""  value="999" readonly="readonly" style="width: 60px"></p> -->
    
</div>
<div id="showHtml" class="tabBoxSm" <c:if test="${quotation.id!=null && quotation.id!=''}">style="overflow-y: auto;height: 574px;"</c:if>>
    <div class="tabSm smOrderBox">
        <div class="items clearfix">
            <div class="col-33 clearfix haveToBox">
            <!--  款号 -->
                <p class="tit"><spring:message code="quotation_create_styleNO"/></p>
                <input type="hidden" id="styleID" name="styleID"  value="${quotation.styleID}">
                <input id="styleNO" name="styleNO" onchange="changeStyle();"  value="${quotation.styleNO}" readonly="readonly" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_styleNO"/>">
                <button type="button" onclick="popup('900px','584px','${ctx}/quotation/message/createStyle?frameFlg=0')"><spring:message code="quotation_create_select"/></button>
                <p class="haveTo">*</p>
            </div>
            <div class="col-33 clearfix">
            <!--  款式名称 -->
                <p class="tit"><spring:message code="quotation_create_styleNameCN"/></p>
                <input id="styleNameCN" name="styleNameCN"   value="${quotation.styleNameCN}" style="border:none;background-color:inherit;color:#333" readonly="readonly">
            </div>
             <div class="col-33 clearfix">
             <!--  客户 -->
                <p class="tit"><spring:message code="quotation_create_styleCustomerName"/></p>
                <input id="styleCustomerName" name="styleCustomerName"  value="${quotation.styleCustomerName}" style="border:none;background-color:inherit;color:#333" readonly="readonly">
            </div>
        </div>
        <div class="items clearfix">
            <div class="col-33 clearfix haveToBox">
            <!-- 单耗号  -->
                <p class="tit"><spring:message code="quotation_create_unitCostNO"/></p>
                <input type="hidden" id="unitCostID" name="unitCostID"  value="${quotation.unitCostID}">
                <select id="unitCostNO" name="unitCostNO" style="width: 150px" onchange="findUnit(this);" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_unitCostNO"/>">
                            
                </select>
                <p class="haveTo">*</p>
            </div>
            <div class="col-33 clearfix">
            <!-- 单耗成本  -->
                <p class="tit"><spring:message code="quotation_create_unitCost"/></p>
                <input id="unitCost" name="unitCost" onchange="quotationMath();"  value="${quotation.unitCost}" style="border:none;background-color:inherit;color:#333" readonly="readonly">
            </div>
            <div class="col-33 clearfix">
            <!-- 物料数量  -->
                <p class="tit"><spring:message code="quotation_create_materialQuantity"/></p>
                <input id="materialSum" name="materialSum"  value="" style="border:none;background-color:inherit;color:#333" readonly="readonly">
            </div>
        </div>
        <p class="title"><spring:message code="quotation_create_quotationMessege"/></p>
        <div class="clearfix">
        	<div class="left w-500">
        	<input type="hidden" id="id" name="id" value="${quotation.id}">
        	<!-- 面料金额 -->
        	<input type="hidden" id="materail" name="materail" value="">
        	<input type="hidden" id="accessorie" name="accessorie" value="">
        	<input type="hidden" id="others" name="others" value="">
        	<input type="hidden" id="printingEmbroidery" name="printingEmbroidery" value="">
        	<input type="hidden" id="brand" name="brand" value="">
        	
        	<input type="hidden" id="offerNumber" name="offerNumber" value="${quotation.offerNumber}">
    		<input type="hidden" id="createDate" name="createDate" value="${fns:getDate('yyyy-MM-dd HH:mm')}">
            	<div class="items clearfix">        	
                    <div class="col-50 clearfix haveToBox">
                    <!-- 报价类型  -->
                        <p class="tit"><spring:message code="quotation_create_quotationType"/></p>
                        <c:set value="QUOTATION_TYPE" var="typeList"/>
                        <select id="offerTypeCD" name="offerTypeCD" style="width: 150px" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_quotationType"/>">
                            <option value=""><spring:message code="quotation_create_selectPlease"/></option>
                        <c:forEach items="${fns:getDictList(typeList) }" var="quotationType">
                            <option   value="${quotationType.itemCode}-${quotationType.itemValue}" <c:if test="${fn:split(quotation.offerTypeCD,'-')[1] eq quotationType.itemValue }">selected="selected"</c:if>>${quotationType.itemName}</option>
                        </c:forEach>
                        </select>
                        <p class="haveTo">*</p>
                    </div>
                    <div class="col-50 clearfix haveToBox">
                    <!--  报价日期 -->
                        <p class="tit"><spring:message code="quotation_create_offerDate"/></p>
                        <input type="text" onblur="CheckDate(this);" 
								id="offerDate" name="offerDate"  value="<fmt:formatDate value="${quotation.offerDate }" pattern="yyyy-MM-dd" />" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_offerDate"/>">
								<p class="haveTo">*</p>
                    </div>
                </div>
                <div class="items clearfix">        	
                    <div class="col-50 clearfix haveToBox">
                    <!--  币种 -->
                        <p class="tit"><spring:message code="quotation_create_currency"/></p>
                        <c:set value="QUOTATION_CURRENCY" var="currencyList"/>
                        <select id="offerCurrencyCD" name="offerCurrencyCD" style="width: 150px" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_currency"/>">
                            <option value=""><spring:message code="quotation_create_selectPlease"/></option>
                        <c:forEach items="${fns:getDictList(currencyList) }" var="quotationCurrency">
                            <option  value="${quotationCurrency.itemCode}-${quotationCurrency.itemValue}" <c:if test="${fn:split(quotation.offerCurrencyCD,'-')[1] eq quotationCurrency.itemValue }">selected="selected"</c:if>>${quotationCurrency.itemName}</option>
                        </c:forEach>
                        </select>
                        <p class="haveTo">*</p>
                    </div>
                    <div class="col-50 clearfix haveToBox">
                    <!-- 汇率  -->
                        <p class="tit"><spring:message code="quotation_create_exchangeRate"/></p>
                        <input id="offerExchangeRate" name="offerExchangeRate"  value="<fmt:formatNumber value="${quotation.offerExchangeRate }" pattern="###0.000#"/>" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_exchangeRate"/>">
                        <p class="haveTo">*</p>
                    </div>
                </div>
                <div class="items clearfix">        	
                    <div class="col-50 clearfix haveToBox">
                    <!-- 报价数量  -->
                        <p class="tit"><spring:message code="quotation_create_offerQuantity"/></p>
                        <input id="offerQuantity" name="offerQuantity"  value="<fmt:formatNumber value="${quotation.offerQuantity}"  pattern="#,##0"/>" onkeyup="(this.vas=function(){this.value=this.value.replace(/[^0-9-]+/,'');}).call(this)" onblur="this.vas();" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_offerQuantity"/>">
                        <p class="haveTo">*</p>
                    </div>
                    <div class="col-50 clearfix haveToBox">
                    <!-- 单件金额  -->
                        <p class="tit"><spring:message code="quotation_create_offerAmount"/></p>
                        <input id="offerAmount" name="offerAmount" onchange="quotationMath();" style="border:none;background-color:inherit;color:#333" readonly="readonly"  value="<c:if test="${quotation.offerAmount != 0 }">${quotation.offerAmount}</c:if><c:if test="${quotation.offerAmount == 0 }"></c:if>" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_offerAmount"/>" >
                        <p class="haveTo">*</p>
                    </div>
                </div>
                 <div class="items clearfix haveToBox">        	
                    <div class="col-50 clearfix">
                    <!-- 单件利润  -->
                        <p class="tit"><spring:message code="quotation_create_offerMargins"/></p>
                        <input id="offerMargins" name="offerMargins"  onchange="quotationMath();" value="<fmt:formatNumber value="${quotation.offerMargins }" pattern="#,##0.00#"/>" onfocus="unFormat(this);" onblur="formatMoney(this, 2);" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_offerMargins"/>">
                    	<p class="haveTo">*</p>
                    </div>
                    <div class="col-50 clearfix haveToBox">
                    <!-- 加工费  -->
                        <p class="tit"><spring:message code="quotation_create_offerCM"/></p>
                        <input id="offerCM" name="offerCM" onchange="quotationMath();"  value="<fmt:formatNumber value="${quotation.offerCM }" pattern="#,##0.00#"/>" onfocus="unFormat(this);" onblur="formatMoney(this, 2);" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_offerCM"/>">
                    	<p class="haveTo">*</p>
                    </div>
                </div>
                 <div class="items clearfix">        	
                    <div class="col-50 clearfix haveToBox">
                    <!-- 单件折扣  -->
                        <p class="tit"><spring:message code="quotation_create_offerRebate"/></p>
                        <input id="offerRebate" name="offerRebate" onchange="quotationMath();"  value="<fmt:formatNumber value="${quotation.offerRebate }"/>" onfocus="unFormat(this);" onblur="formatMoney(this, 2);" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_offerRebate"/>">
                        <p class="haveTo">*</p>
                    </div>
                    <div class="col-50 clearfix haveToBox">
                    <!--  单件佣金  -->
                        <p class="tit"><spring:message code="quotation_create_offerBrokerage"/></p>
                        <input id="offerBrokerage" name="offerBrokerage" onchange="quotationMath();"  value="<fmt:formatNumber value="${quotation.offerBrokerage }" pattern="#,##0.00#"/>" onfocus="unFormat(this);" onblur="formatMoney(this, 2);" data-rule-required="true" data-msg-required="<spring:message code="quotation_error_msg_offerBrokerage"/>">
                        <p class="haveTo">*</p>
                    </div>
                </div>
                <div class="items clearfix" style="margin-bottom:0;">     
                    <!-- 备　　注  -->
                    <p class="tit"><spring:message code="quotation_create_remark"/></p>
                    <textarea id="remark" name="remark" style="width:465px;height: 60px">${quotation.remark }</textarea>
                </div>
            </div>
            <div class="">
            	<div class="styleImgBg clearfix" style="width: 310px; height: 300px; padding-top: 30px; margin-left: 85px; float: left;">
            			<!--   -->
							<div class="squareBtn squareL" style="margin-left: -85px;margin-top:-57px">
								<img src="${ctxStatic}/images/btn_left.png">
							</div>
						       <div class="square" style="width: 330px; height: 230px; margin-top: -1px; margin-left: -30px;">
							   <input type="hidden" id="nameImage" name="myStyleFile" value="${myStyleFileTemp}" htmlEscape="false" class="input-xlarge" />
							   <sys:ckfinder input="nameImage" type="images"  uploadPath="/bigcargoStyle" selectMultiple="true" maxWidth="100px" maxHeight="100px" />
						       </div>
							<div class="squareBtn squareR" style="margin-top:-287px;margin-left:300px">
								<img src="${ctxStatic}/images/btn_right.png">
							</div>
						</div>
            </div>
        </div>
        <c:if test="${quotation.id!=null && quotation.id!=''}">
         <p class="title" style="margin-top:0;margin-bottom:5px;"><spring:message code="quotation_create_history"/></p>
         </c:if>
         <div class="tableArea">
        	<div class="tableScroll tableScrollSm">
        <c:if test="${quotation.id!=null && quotation.id!=''}">
        		<table cellpadding="0" class="tableHead">
                    <thead>
                    <tr>
                    	<th class="tab-bjr"><spring:message code="quotation_create_quotator"/></th>
                        <th class="tab-rq"><spring:message code="quotation_create_quotationDate"/></th>
                        <th class="tab-mianl"><spring:message code="quotation_create_materail"/></th>
                        <th class="tab-ful"><spring:message code="quotation_create_accessorie"/></th>
                        <th class="tab-yxh"><spring:message code="quotation_create_printingEmbroidery"/></th>
                        <th class="tab-bp"><spring:message code="quotation_create_brand"/></th>
                        <th class="tab-jgf"><spring:message code="quotation_create_CM"/></th>
                        <th class="tab-lr"><spring:message code="quotation_create_margins"/></th>
                        <th class="tab-zk"><spring:message code="quotation_create_rebate"/></th>
                        <th class="tab-yj"><spring:message code="quotation_create_brokerage"/></th>
                        <th class="tab-bj"><spring:message code="quotation_create_quotation"/></th>
                    </tr>
                    </thead>
                </table>
                <table cellpadding="0" class="tableBody">
                    <tbody id="historyList">
                    <c:forEach items="${quotation.quotationHistoryList }" var="history">
                    <tr>
                    	<td class="tab-bjr">${history.createBy.firstName}</td>
                        <td class="tab-rq"><fmt:formatDate value="${history.offerDate }" pattern="yyyy-MM-dd" /></td>
                        <td class="tab-mianl"><fmt:formatNumber value="${history.materail}" pattern="#,##0.00#"/></td>
                        <td class="tab-ful"><fmt:formatNumber value="${history.accessorie}" pattern="#,##0.00#"/></td>
                        <td class="tab-yxh"><fmt:formatNumber value="${history.printingEmbroidery}" pattern="#,##0.00#"/></td>
                        <td class="tab-bp"><fmt:formatNumber value="${history.brand}" pattern="#,##0.00#"/></td>
                        <td class="tab-jgf"><fmt:formatNumber value="${history.offerCM}" pattern="#,##0.00#"/></td>
                        <td class="tab-lr"><fmt:formatNumber value="${history.offerMargins}" pattern="#,##0.00#"/></td>
                        <td class="tab-zk"><fmt:formatNumber value="${history.offerRebate}" pattern="#,##0.00#"/></td>
                        <td class="tab-yj"><fmt:formatNumber value="${history.offerBrokerage}" pattern="#,##0.00#"/></td>
                        <td class="tab-bj"><fmt:formatNumber value="${history.offerAmount}" pattern="#,##0.00#"/></td>
                    </tr>
                   </c:forEach>
                    </tbody>
                </table>
	</c:if>
            </div>
        </div>
	</div>
    <div class="tabSm none">
    	<div class="tableArea">
        	<div class="tableScroll tableScrollSm">
        		<table cellpadding="0" class="tableHead">
                    <thead>
                    <tr>
                    	<th><p class="tab-cz"><spring:message code="quotation_create_operation"/></p></th>
                        <th><p class="tab-wltp"><spring:message code="quotation_create_materailImage"/></p></th>
                        <th><p class="tab-wlmcbj"><spring:message code="quotation_create_materailNameNO"/></p></th>
                        <th><p class="tab-wllb"><spring:message code="quotation_create_materailType"/></p></th>
                        <th><p class="tab-fk"><spring:message code="quotation_create_materailSpec"/></p></th>
                        <th><p class="tab-dw"><spring:message code="quotation_create_materailSpecUnit"/></p></th>
                        <th><p class="tab-dh" style="width: 70px;"><spring:message code="quotation_create_materailCost"/></p></th>
                        <th><p class="tab-sh" style="width: 70px;"><spring:message code="quotation_create_materailPreLoss"/></p></th>
                        <th><p class="tab-zdj" style="width: 70px;"><spring:message code="quotation_create_materailSellUnitPrice"/></p></th>
                        <th><p class="tab-dj" style="width: 70px;"><spring:message code="quotation_create_materailUnitPrice"/></p></th>
                        <th><p class="tab-ts" style="width: 70px;"><spring:message code="quotation_create_materailTaxRebate"/></p></th>
                        <th><p class="tab-jj" style="width: 70px;"><spring:message code="quotation_create_materailTotalPrice"/></p></th>
                        <th><p class="tab-hjje" style="width: 80px;"><spring:message code="quotation_create_materailSellTotalPrice"/></p></th>
                    </tr>
                    </thead>
                </table>
                <table  cellpadding="0" class="tableBody" id="materialTable">
                    <tbody id="listHtml">
                    <c:forEach items="${quotation.quotationMaterialList }" var="material" varStatus="status">
                    <tr>
                    	<td><p class="tab-cz"><img src='${ctxStatic}/images/btn-sc.png' class="tab-cz" onclick='deleteCurrentRow(this)'></p></td>
                        <td><p class="tab-wltp"><c:if test="${material.materialFile!=null && material.materialFile!='' }"><img src="${material.materialFile }" class="wltp"></c:if><c:if test="${material.materialFile==null||material.materialFile=='' }"><img src="${ctxStatic}/images/pic-none.jpg" class="wltp"></c:if></p></td>
                        <td><p class="tab-wlmcbj">${material.materialCode }<br>${material.materialNameCN }</p></td>
                        <td><p class="tab-wllb">${material.styleMaterialTypeCN }</p></td>
                        <td><p class="tab-fk">${material.materialSpec }</p></td>
                        <td><p class="tab-dw">${material.materialSpecUnit }</p></td>
                        <td><p class="tab-dh" style="width: 70px;"><input name="quotationMaterialList[${status.index }].materialCost" value="<fmt:formatNumber value="${material.materialCost}" pattern="#,##0.00#"/>" onchange="myMath(this,0);"/></p></td>
                        <td><p class="tab-sh" style="width: 70px;"><input name="quotationMaterialList[${status.index }].materialPreLoss" value="<fmt:formatNumber value="${material.materialPreLoss}" pattern="#,##0.00#"/>" onchange="myMath(this,0);"/></p></td>
                        <td><p class="tab-zdj" style="width: 70px;"><input name="quotationMaterialList[${status.index }].materialUnitExpend" value="<fmt:formatNumber value="${material.materialUnitExpend}" pattern="#,##0.00#"/>"/></p></td>
                        <td><p class="tab-dj" style="width: 70px;"><input name="quotationMaterialList[${status.index }].materialUnitPrice" value="<fmt:formatNumber value="${material.materialUnitPrice}" pattern="#,##0.00#"/>" onchange="myMath(this,0);"/></p></td>
                        <td><p class="tab-ts" style="width: 70px;"><input name="quotationMaterialList[${status.index }].materialTaxRebate" value="<fmt:formatNumber value="${material.materialTaxRebate}" pattern="#,##0.00#"/>" onchange="myMath(this,0);"/></p></td>
                        <td><p class="tab-jj" style="width: 70px;"><fmt:formatNumber value="${material.materialUnitPrice*material.materialTaxRebate }" pattern="#,##0.00#"/></p></td>
                        <td><p class="tab-hjje" style="width: 80px;"><input class="type-${material.materialType} amount" value="<fmt:formatNumber value="${material.materialUnitPrice*material.materialTaxRebate*material.materialUnitExpend }" pattern="#,##0.00#"/>"/></p></td>
                        <input type="hidden" name="quotationMaterialList[${status.index }].materialID" value="${material.materialID}"/>
                    </tr>
                    </c:forEach>
                    </tbody>
                </table>
                <div id="hiddenHtml"></div>
            </div>
        </div>
</div>
</div>
</form>
<script>
	window.onload = function(){
			var windowH = window.innerHeight
					||document.documentElement.clientHeight
					||document.body.clientHeight
			$('.tabSm').css({
				'height':windowH - 77,
			});
			$('.tableScrollSm').css({
				'height':windowH - 91
			})
		};
	$('.squareL').on('click', function() {
	    var lastCon = $('.square ol li:last-child').detach();
	    $('.square ol').prepend(lastCon)
	    $('.square ol li:last-child').addClass('active')
	    $('.square ol li:last-child').siblings().removeClass('active')
	})

	$('.squareR').on('click', function() {
	    var lastCon = $('.square ol li:first-child').detach();
	    $('.square ol').append(lastCon)
	    $('.square ol li:last-child').addClass('active')
	    $('.square ol li:last-child').siblings().removeClass('active')
	})
</script>
</body>
</html>
